<template>
  <div class="clue_import">
    <dt-grid ref="table" page :onFetch="onFetch">
      <div class="flex btn-content" slot="btn">
        <Button type="primary" @click="importBtn" v-if="unlocking('0213030100')">导入线索</Button>
      </div>
    </dt-grid>
    <import-modal ref="importModal" @success="onSuccess" />
    <allot-modal ref="allotModal" @success="onSuccess" />
  </div>
</template>

<script>
  import Column from './opt/column.js'
  import importModal from './component/importModal.vue'
  import allotModal from './component/allotModal.vue'
  import clueImportMgr from '@/biz/customer/clueImport'

  export default {
    components: {
      importModal,
      allotModal
    },
    data() {
      return {}
    },
    methods: {
      importBtn() {
        this.$refs.importModal.show()
      },
      onFetch(data) {
        let params = {
          ...data
        }
        return clueImportMgr.getBatchList(params).then((res) => {
          res.list = res.records
          return res
        })
      },
      checkFun(data) {
        let status =
          data.unallocatedNum > 0 ? 'no_Allot' : data.allocatingNum == 0 ? 'rejected_Allot' : 'wait_Allot'
        this.$router.push({
          name: 'clueImportDetail',
          query: {
            batchId: data.id,
            status: status
          }
        })
      },
      delFun(data) {
        clueImportMgr.deleteByBatchId({ batchId: data.id }).then((res) => {
          this.$Message.success('删除成功')
          this.$refs.table.fetch()
        })
      },
      allotFun(data) {
        this.$refs.allotModal.show({
          num: data.unallocatedNum,
          recordIds: [],
          batchId: data.id
        })
      },
      downloadFun(data) {
        clueImportMgr.downloadByBatchId({
          batchId: data.id,
          fileName: data.batchName + '.xls'
        })
      },
      onSuccess() {
        this.$refs.table.fetch(true)
      }
    },
    mounted() {
      this.$refs.table.init(this, new Column(this))
      this.$refs.table.fetch()
    }
  }
</script>

<style>
  .clue_import {
    padding: 20px;
  }
</style>
